<template>
  <section>
    <sel-com-dep v-on:get="getDepartment"></sel-com-dep>
    <el-form label-width="80px">
      <el-form-item label="标题">
        <el-input size="mini" v-model="form.title"></el-input>
      </el-form-item>
      <el-form-item label="入库类型">
        <el-select v-model="form.stockInTypeCode" size="mini">
          <el-option v-for="type in stockInTypeList" :key="type.id" :value="type.code" :label="type.name">{{type.name}}</el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="选择仓库">
        <el-select v-model="form.warehouseCode" size="mini">
          <el-option v-for="type in warehouseList" :key="type.id" :value="type.code" :label="type.name">{{type.name}}</el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <el-row>
      <i class="el-icon-plus" @click="addItem"></i>
    </el-row>
    <el-table :data="items">
      <el-table-column type="index" label="序号"/>
      <el-table-column label="商品编码" prop="sn">
        <template slot-scope="scope">
          <el-input size="mini" v-model="scope.row.sn"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="规格描述" prop="title">
        <template slot-scope="scope">
          <el-input size="mini" v-model="scope.row.title"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="单位" prop="unit">
        <template slot-scope="scope">
          <el-input size="mini" v-model="scope.row.unit"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="入库量" prop="num">
        <template slot-scope="scope">
          <el-input size="mini" v-model="scope.row.num"></el-input>
        </template>
      </el-table-column>
    </el-table>
    <el-button size="mini" @click="subBtn" type="primary">新建</el-button>
  </section>
</template>

<script>
  import selComDep from '@/components/coupon/selComDep'
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import Vue from 'vue'//后续添加属性，需要vue联动
  import errHandler from '@/assets/errHandler'
  export default {
    components:{selComDep},
    name: "newGodownEntry",
    data() {
      return {
        stockInTypeList:null,
        warehouseList:null,
        form:{
          title:'',
          stockInTypeCode:null,
          departmentCode:null,
          warehouseCode:null,
          godownEntryItems:null
        },
        items:[]
      }
    },
    created(){
      this.getStockInTypes()
      this.getWarehouseList()
    },
    computed:{
    },
    watch: {
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      subBtn(){
        console.log(this.items)
        this.form.godownEntryItems=JSON.stringify(this.items)
        console.log(this.form)
        this.createGodownEntry(this.form)
      },
      addItem(){
        this.items.push({})
      },
      getDepartment(e){
        console.log(e)
        this.form.departmentCode=e.code
        // this.getGoodsList()
      },
      getStockInTypes(){
        this.fetch({name:"getStockInTypes"})
          .then(res=>{
            console.log(res)
            this.stockInTypeList=res
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      getWarehouseList(){
        this.fetch({name:"getWarehouseList"})
          .then(res=>{
            console.log(res)
            this.warehouseList=res
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      createGodownEntry(data){
        // 'stockInTypeCode','departmentCode','warehouseCode','title' godownEntryItems
        this.fetch({name:"createGodownEntry",data})
          .then(res=>{
            console.log('创建成功',res)
            this.$emit('cancel')
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      }
    }
  }
</script>

<style scoped>

</style>
